import React, { FC, useEffect } from 'react'
import { connect } from 'react-redux'
import { Link } from 'react-router-dom'
import MyHead from '../../components/MyHead'
import { getMyLikes } from '../../redux/actions'
import { Popup, Space, Button } from 'antd-mobile'

const MyLikes:FC<any>= ({
    //下面解构后，这里也需要
    userInfo,
    myLikes, 
    dispatch,
}) => {
    // 请求数据 (拿到数据)
    useEffect(()=>{
        dispatch(getMyLikes({
            phone: userInfo.phone
        }))
    },[])
  return (
    <div>
        <MyHead title="我的点赞"/>
        <div style={{padding:30}}>
            {
                myLikes.map((item:any,index:number)=>{
                    return(
                        <Link key={index} to={"/good/"+item.goodId} style={{display:'flex',width:"100%",marginTop:30}}>
                        <img src={item.good.img} alt=""  style={{width:200,height:200,marginRight:30}}  />
                        <div >
                            <h3 >{item.good.name}</h3>
                            <p>单价：{item.good.price}</p>
                            <p>小计：{item.good.price}</p>
                            <p>分类：{item.good.type.text}</p>
                        </div>
                        </Link>
                    )
                })
            }
         
        </div>
    </div>
  )
}

export default connect(
    // 拿到数据
    (state:any)=>{
        console.log(state);
        return{
            // 得到数据后 解构  这里解构后，上面也需要
            userInfo: state.getIn(['data','userInfo']),
            myLikes:state.getIn(['data','myLikes']),
        }
        
    }
)(MyLikes)